/*
    Mobile menu
*/
$mobile_toggle_menu:											$default_color2;
$mobile_menu_bg:												#ffffff;
$mobile_menu_fullscreen_bg:										rgba(0, 0, 0, 0.5);
$mobile_menu_btn_text:											$default_color2;
$mobile_menu_btn_text_hover:									$default_color;
$mobile_menu_btn_bg:											transparent;
$mobile_menu_btn_bg_hover:										transparent;
$mobile_menu_btn_icon:											$mobile_menu_btn_text;
$mobile_menu_btn_icon_hover:									$mobile_menu_btn_text_hover;
$mobile_menu_btn_separator:										$border;
$mobile_menu_close_text:										$mobile_menu_btn_text;
$mobile_menu_close_text_hover:									$mobile_menu_btn_text_hover;
$mobile_menu_close_bg:											$mobile_menu_btn_bg;
$mobile_menu_close_bg_hover:									$mobile_menu_btn_bg_hover;
$mobile_menu_close_icon:										$mobile_menu_btn_icon;
$mobile_menu_close_icon_hover:									$mobile_menu_btn_icon_hover;
$mobile_menu_close_separator:									$mobile_menu_btn_separator;
$mobile_menu_prev_text:											$mobile_menu_btn_text;
$mobile_menu_prev_text_hover:									$mobile_menu_btn_text_hover;
$mobile_menu_prev_bg:											$mobile_menu_btn_bg;
$mobile_menu_prev_bg_hover:										$mobile_menu_btn_bg_hover;
$mobile_menu_prev_icon:											$mobile_menu_btn_icon;
$mobile_menu_prev_icon_hover:									$mobile_menu_btn_icon_hover;
$mobile_menu_prev_separator:									$mobile_menu_btn_separator;
$mobile_menu_next_text:											$default_color2;
$mobile_menu_next_text_hover:									$mobile_menu_btn_text_hover;
$mobile_menu_next_bg:											$mobile_menu_btn_bg;
$mobile_menu_next_bg_hover:										$mobile_menu_btn_bg_hover;
$mobile_menu_next_icon:											$mobile_menu_btn_icon;
$mobile_menu_next_icon_hover:									$mobile_menu_btn_icon_hover;
$mobile_menu_next_separator:									$mobile_menu_btn_separator;
$mobile_menu_original_link_text:								$default_color2;
$mobile_menu_original_link_text_hover:							$mobile_menu_btn_text_hover;
$mobile_menu_original_link_bg:									$mobile_menu_btn_bg;
$mobile_menu_original_link_bg_hover:							$mobile_menu_btn_bg_hover;
$mobile_menu_original_link_icon:								$mobile_menu_btn_icon;
$mobile_menu_original_link_icon_hover:							$mobile_menu_btn_icon_hover;
$mobile_menu_original_link_separator:							$mobile_menu_btn_separator;
$mobile_menu_link:												$default_color2;
$mobile_menu_link_hover:										$default_color;
$mobile_menu_link_bg:											transparent;
$mobile_menu_link_bg_hover:										transparent;
$mobile_menu_link_level_01:										$mobile_menu_link;
$mobile_menu_link_level_01_hover:								$mobile_menu_link_hover;
$mobile_menu_link_level_01_bg:									$mobile_menu_link_bg;
$mobile_menu_link_level_01__bg_hover:							$mobile_menu_link_bg_hover;
$mobile_menu_link_level_01_icon:								$mobile_menu_link_level_01;
$mobile_menu_link_level_01_icon_hover:							$mobile_menu_link_level_01_hover;

.panel-menu,
.mmpanels,
.mmpanels > .mmpanel{
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    width: inherit;
}
.panel-menu{
    width: 270px;
    background: $mobile_menu_bg;
    position: fixed;
    z-index: 50;
    box-shadow: 0 2px 2px rgba(0,0,0,0.06);
    // level default
    ul{
        list-style-type: none;
        margin: 0;
        padding: 0;
        li{
            margin: 0;
            width: 100%;
            a{
                display: flex;
                padding: 9px 27px 9px 29px;
                font-size: 16px;
                line-height: 22px;
                text-decoration: none;
                color: $mobile_menu_link;
                background:$mobile_menu_link_bg;
                position: relative;
                font-weight: 500;
                transition: all 0.2s linear;
            }
            a:hover{
                color: $mobile_menu_link_hover;
                 background:$mobile_menu_link_bg_hover;
            }

        }
    }
    // level - 01
    #mm0.mmpanel{
        a:not(.mm-close){
            color: $mobile_menu_link_level_01;
            background-color: $mobile_menu_link_level_01_bg;
            &:after{
                color: $mobile_menu_link_level_01_icon;
            }
        }
        a:not(.mm-close):hover{
            color: $mobile_menu_link_level_01_hover;
            background-color: $mobile_menu_link_level_01__bg_hover;
            &:after{
                color: $mobile_menu_link_level_01_icon_hover;
            }
        }
        .mm-next-level:after{
            top: 12px;
        }
    }
    // level - 02
    .mmpanel{
        .mm-original-link{
            .tt-badge{
                top:-1px;
            }
        }
    }

    // nav
    .mm-close,
    .mm-prev-level,
    .mm-original-link{
        display: block;
        color: $mobile_menu_btn_text;
        background-color: $mobile_menu_btn_bg;
        background-color: $mobile_menu_btn_bg;
    }
    .mm-close:before,
    .mm-prev-level:before,
    .mm-next-level:after{
        font-size: 14px;
        line-height: 14px;
        font-weight: bold;
        transition: all 0.2s linear;
        color: $mobile_menu_btn_icon;
    }
    .mm-close:hover,
    .mm-prev-level:hover,
    .mm-next-level:hover{
        color: $mobile_menu_btn_text_hover;
        background-color: $mobile_menu_btn_bg_hover;
    }
    .mm-close:hover:before
    .mm-prev-level:hover:before,
    .mm-next-level:hover:after{
        color: $mobile_menu_btn_icon_hover;
    }

    // btn close
    li.mm-close-parent{
        margin-bottom: 15px;
        .mm-close{
            padding: 24px 16px 23px 29px;
            color:  $mobile_menu_close_text;
            border-bottom: 1px solid $mobile_menu_close_separator;
            background-color: $mobile_menu_close_bg;
            .tt-icon{
                position: absolute;
                right: 10px;
                top: 0;
                padding: 23px 10px 23px;
                svg{
                    width: 14px;
                    height: 14px;
                    fill:#687176;
                }
            }
        }
        .mm-close:hover{
            color:  $mobile_menu_close_text_hover;
            background-color: $mobile_menu_close_bg_hover;
            svg{
                fill:#2172cd;
            }
        }
    }
    //prev level
    .mm-prev-level{
        padding: 14px 16px 15px 29px;
        color:  $mobile_menu_prev_text;
        background-color: $mobile_menu_prev_bg;
        border-bottom: 1px solid $mobile_menu_prev_separator;
         margin-bottom: 15px;
    }
    .mm-prev-level:before{
        content: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 8L3.43431 7.43431L2.86863 8L3.43431 8.56569L4 8ZM10.4343 0.434315L3.43431 7.43431L4.56569 8.56569L11.5657 1.56569L10.4343 0.434315ZM3.43431 8.56569L10.4343 15.5657L11.5657 14.4343L4.56569 7.43431L3.43431 8.56569Z' fill='%23666f74'/%3E%3C/svg%3E%0A");
        padding-right: 10px;
        position: relative;
        top: 2px;
        color: $mobile_menu_prev_icon;
        display: inline-block;
    }
    .mm-prev-level:hover{
        color:  $mobile_menu_prev_text_hover;
        background-color: $mobile_menu_prev_bg_hover;
        &:before{
            color:  $mobile_menu_prev_icon_hover;
        }
    }
    //next level
    .mm-next-level{
        color: $mobile_menu_next_text;
        background-color: $mobile_menu_next_bg;
    }
    .mm-next-level:after{
        content: url("data:image/svg+xml,%3Csvg width='16' height='16' viewBox='0 0 16 16' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M4 1L11 8L4 15' stroke='%23666f74' stroke-width='1.6'/%3E%3C/svg%3E%0A");
        padding-left: 10px;
        top: 10px;
        right: 30px;
        position: absolute;
        color: $mobile_menu_next_icon;
    }
    .mm-next-level:hover{
        color: $mobile_menu_next_text_hover;
        background-color: $mobile_menu_next_bg_hover;
        &:after{
            color: $mobile_menu_next_icon_hover;
        }
    }

    //original link
    .mm-original-link{
        font-weight: 700;
        color: $mobile_menu_original_link_text;
        background-color: $mobile_menu_original_link_bg;
    }
    .mm-original-link:before{
        padding-right: 10px;
        color: $mobile_menu_original_link_icon;
    }
    .mm-original-link:hover{
        color: $mobile_menu_original_link_text_hover;
        background-color: $mobile_menu_original_link_bg_hover;
        &:before{
            color: $mobile_menu_original_link_icon_hover;
        }
    }
}
.mm-open{
    overflow: hidden;
    .mm-fullscreen-bg{
        cursor: pointer;
        background-color: $mobile_menu_fullscreen_bg;
        position: fixed;
        top: 0;
        left: 0;
        overflow: hidden;
        width: 100%;
        height: 100%;
        z-index: 23;
        display: none;
    }
}
.mmitemopen.panel-menu,
.mmitemopen.panel-menu.mm-right{
    -webkit-transition: -webkit-transform .3s ease;
    transition: -webkit-transform .3s ease;
    transition: transform .3s ease;
    transition: transform .3s ease,-webkit-transform .3s ease;
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    transform: translate(0,0);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
.panel-menu{
    -webkit-transform: translate(-100%,0);
    -ms-transform: translate(-100%,0);
    transform: translate(-100%,0);
    -webkit-transform: translate3d(-100%,0,0);
    transform: translate3d(-100%,0,0);
}
.panel-menu.mm-right,
.mmitemopen.panel-menu.mm-right.mmhide{
    left: auto;
    right: 0;
    -webkit-transform: translate(100%,0);
    -ms-transform: translate(100%,0);
    transform: translate(100%,0);
    -webkit-transform: translate3d(100%,0,0);
    transform: translate3d(100%,0,0);
}
.mmitemopen.panel-menu.mmhide{
    -webkit-transform: translate(-100%,0);
    -ms-transform: translate(-100%,0);
    transform: translate(-100%,0);
    -webkit-transform: translate3d(-100%,0,0);
    transform: translate3d(-100%,0,0);
}
.mmpanel{
    -webkit-transition: -webkit-transform .3s ease;
    transition: -webkit-transform .3s ease;
    transition: transform .3s ease;
    transition: transform .3s ease,-webkit-transform .3s ease;
    -webkit-transform: translate(100%,0);
    -ms-transform: translate(100%,0);
    transform: translate(100%,0);
    -webkit-transform: translate3d(100%,0,0);
    transform: translate3d(100%,0,0);
}
.mmpanels{
    overflow: hidden;
}
.mmpanel.mmopened{
    -webkit-transform: translate(0,0);
    -ms-transform: translate(0,0);
    transform: translate(0,0);
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
.mmpanel.mmsubopened{
    -webkit-transform: translate(-80%,0);
    -ms-transform: translate(-80%,0);
    transform: translate(-80%,0);
    -webkit-transform: translate3d(-80%,0,0);
    transform: translate3d(-80%,0,0);
}
.mmpanels > .mmpanel{
    overflow: scroll;
    overflow-x: hidden;
    overflow-y: auto;
}
.mmpanels,
.mmpanels >
.mmpanel{
    background: inherit;
    border-color: inherit;
}
.mmpanels > .mmpanel:not(.mmhidden){
    display: block;
}
.mmpanels >.mmpanel:after{
    content: '';
    display: block;
    height: 20px
}
.mmhidden,
.mm-nav-btn{
    display: none;
}
.mm-fullscreen-bg,
.mm-fullscreen-bg:focus,
.mm-fullscreen-bg:active,
.mm-fullscreen-bg:hover{
    outline: none;
}


.tt-menu-slider {
    max-height: 389px;
}
